<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
		<link href="resources/css/mui.min.css" rel="stylesheet" />
		<link href="resources/css/common1.css" rel="stylesheet" />
		<link href="resources/css/swiper.css" rel="stylesheet" />
		<script src="resources/js/swiper.js"></script>
		<script src="resources/js/jquery-1.10.1.min.js"></script>
		<script src="resources/js/WebViewJavascriptBridge.js"></script>
		<script src="resources/js/common.js"></script>
		<script src="resources/js/vue.min.js"></script>
		<title>超贷-浏览记录</title>
		<style>
			.mui-bar{background-color: #2487ff;}
			.mui-bar-nav~.mui-content{padding-top: 0px;}
			a:active{color: #fff;}
			.mui-title{color: #fff;}
			.headerMsg{width: 10%; height: 60px; float: left; text-align: right;}
			.headerMsg img{width: 28px;  margin-top: 16px;}
			.listLogo{background-color: #fff; padding-top: 10px;}
			.listLogo img{width: 60%;}
			.listLogo .mui-row{ text-align: center; border-bottom: 1px solid #eee;}
			.marqueeBox{width: 100%; padding: 0px 10px; height: 40px; line-height: 40px;}
			.marqueeLogo{float: left; padding-left: 22px; position: relative; width: 60px; height: 40px; background-color: #fff;}
			.marqueeLogo img{ width: 18px; left: 0px; top:10px;  position: absolute; margin-right: 5px;}
			.marqueeTit{ width:calc(100% - 60px); float: left; height: 24px; margin-top: 8px; overflow: hidden;}
			.marqueeTit marquee{width: 100%; line-height: 30px;}
			.marqueeTit marquee p{margin: 0; width: 100%; padding: 0; height: 25px;overflow: hidden; white-space: nowrap; text-overflow: ellipsis}
			.newTit2 span{font-size: 12px; border:1px solid #EEEEEE; color: #6c747d; padding: 2px 3px; margin-right: 15px;}
			.moreTit{margin-right: 30px; font-size: 12px; margin-top: 1px;}
			.newTit{margin-right: 15px; font-size: 12px; margin-top: 1px;}
			.newDeail{text-align: center; padding: 8px 0px;}
			.newDeail p{ margin-bottom: 0px; height: 20px;}
			.hotTit img, .newImg{border-radius: 3px;}
			.headerTop{ height: 55px;}
			.mui-content>.mui-table-view:first-child{margin-top: 0px; margin-bottom: 10px;}
			
			.browseTit{position: relative; padding-left: 26px;}
			.browseTit img{position: absolute; width: 8px; top:17px; left: 15px;}
		</style>
		
	</head>

	<body>
	<div id="app">
		<header id="header" class="mui-bar mui-bar-nav">
			<a id="toBack1"  href="javascript:;" onclick="closePage();"  class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left colorf"></a>
			<h1 class="mui-title">浏览记录</h1>
		</header>
		<div class="headerTop"></div>
		<div class="mui-content" v-for="lookList in lookLists">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell browseTit">
					<img src="resources/images/liulanTitImg.png">
					<span class="font-size14">{{lookList.createTime}}</span>
					<span class="moreTit color4">共浏览{{lookList.viewRecords.length}}个产品</span>
				</li>
				<li  class="mui-row" >
			        <div class="mui-col-sm-6 mui-col-xs-6 mui-table-view-cell mui-media hotTit"   v-for="look in lookList.viewRecords">
		                <a href="javascript:;">
							<img class="mui-media-object mui-pull-left" :src="look.loanIcon">
							<div class="mui-media-body font-size14">
								{{look.loanName}}
								<p class='mui-ellipsis'>最高额度<span class="color2">{{look.loanQuota}}万</span></p>
							</div>
						</a>
			        </div>
			       
				</li>
			</ul>
		</div>
	
	
		<!--<div class="mui-row tabBarBox" >
			<li class="active fontS14" onclick="tabBar1()">
                <img src="resources/images/tab-bar11.png"> <br> 首页
	        </li>
  	        <li class="fontS14" onclick="tabBar2()">
                <img src="resources/images/tab-bar2.png"> <br>贷款
	        </li>
	        <li class="fontS14" onclick="tabBar3()">
	            <img src="resources/images/tab-bar3.png">  <br>社区
	        </li>
			<li class="fontS14" onclick="tabBar4()">
                <img src="resources/images/tab-bar4.png"> <br>我的
			</li>
		</div>
		<div class="tabBarBottom"></div>
				-->
		</div>		
		<script>
		var uid = window.localStorage.uid;
	 	var token = window.localStorage.token;
		
		var body= "";
	 	var model ="";
	 	var jdata="";	
		//调接口必传 格式
		 var header={
	     	app_version:'1.1.1',
	     	app_model:'ios',
	     	token:token,
	     	uid:uid 
	     }
	 	body={
 			 'id':uid
	    }
	 	
		var vm = new Vue({
			el : '#app',
			data : {
				lookLists:[],
			},
			created : function() {
				this.init();
			},
			methods : {
				init : function(){
					model={
				    	body:body,
				    	header:header,
				    }
				    jdata=JSON.stringify(model);
					var that=this;
					$.ajax({
						url: 'appUser/viewHistory',
						method: 'post',
						data:{
							'data':jdata
						},
						success: function(data){
							var json=JSON.parse(data);
							if(json.code !="1001"){
								that.lookLists = json.data; 
							}else{
								mui.toast("登录异常");
								window.localStorage.clear();
								location.href="userInfo.html"
							}
							
						},
						error: function(){
							/* alert("数据加载异常!"); */
						}
					});
				},
				search : function(tab,min,max){
					var tab = tab;
					if(tab == '1'){
						body.minQuota = min;
						body.maxQuota = max;
					}
					if(tab == '2'){
						body.loanType = min;
					}
					if(tab == '3'){
						body.minAverageApplyTime = min;
						body.maxAverageApplyTime = max;
					}
					this.init();
				},
			},
			filters : {
				
			}
		})
		</script>		
	</body>

</html>